<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>示例</title>
	</head>
	<body>
		<ul>
			<li class="flower">桂花</li>
			<li class="flower">樱花</li>
			<li class="flower">菊花</li>
		</ul>
		<ol>
			<li class="lake">晨光湖</li>
			<li class="lake">问天湖</li>
		</ol>		
		<script>
			var flower=document.getElementsByTagName('ul');//使用getElementsByTagName()获得页面上标签为ul的元素
			var flower1=flower[0].firstElementChild;
			document.write("输出使用firstElementChild在无序列表中获得的第一个li标签的文本内容是："+flower1.innerText+"<br>");
			var flowers=flower[0].children;
			document.write("逐个输出使用Children在无序列表中获得的各个li标签的文本内容依次是：");
			for(var i=0;i<flowers.length;i++) {document.write(flowers[i].innerText+" ");}
			var flower2=flower[0].nextElementSibling;
			var flowers2=flower2.children;
			document.write("<br>"+"逐个输出使用children在无序列表中获得的各个li标签的文本内容依次是：");
			for(var i=0;i<flowers2.length;i++) {document.write(flowers2[i].innerText+" ");}
		</script>
	</body>
</html>
